<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <link rel="shortcut icon" href="<@s.url '/statics/image/favicon.ico'/>">
</head>
<link rel="stylesheet" href="statics/js/layui/css/layui.css"/>
<link rel="stylesheet" href="statics/css/common.css"/>
<style>
    html, body {
        margin: 0px;
        padding: 0px;
        width: 100%;
        height: 100%;
        text-align:center;
    }
    body>div{
        position: absolute;
        width: 400px;
        margin-left:-200px;margin-top:-150px;
        left:50%;top:50%;
        border:1px solid #D2D2D2;
        border-radius: 8px;
        padding: 50px;
    }
    form {
        width:100%;height:100%;
    }
    .error-msg{
        color:red;
    }
</style>
<script>
    //一般直接写在一个js文件中
    layui.use(['layer', 'form'], function () {
        layer = layui.layer, form = layui.form;
    });

</script>

<body>
<div>
    <form class="layui-form layui-form-pane" action="login.do" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-block">
                <input type="text" name="userId" value="${userId!}" required lay-verify="required" placeholder="用户名" autocomplete="on" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密&nbsp;&nbsp;码</label>
            <div class="layui-input-block">
                <input type="password" name="pwd" value="${pwd!}" required lay-verify="required" placeholder="请输入密码"
                       autocomplete="on"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-mid error-msg">${error!}</div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">登录</button>
            </div>
        </div>
    </form>
</div>
</body>
</html>